import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux';
import _ from 'underscore';
import { Input, Modal, Button, Form,Menu, Dropdown, Icon,Cascader } from 'antd';
import {ContentHeader} from '../../wrapper';
import { tabs, } from '../static/index';
import table from '../../charts/table.js';
import { actions } from '../action/action';
import { _NewTask } from './alltasks';
import {NAME} from '../../admin/component/crmReport.js'

const Search = Input.Search;


class ContentWrapper extends Component {
    componentDidMount() {
        this.props.getAllTaskGroups('find', '');
    }
    componentDidUpdate() {
        this.props.getAllTaskGroups('find', '');
    }
    render() {
        const { getAllTaskGroups } = this.props;
        return <_Content location={this.props.location} children={this.props.children} getAllTaskGroups={getAllTaskGroups} />;
    }
}

const _ContentWrapper = connect(
    state => {
        return {
            trigger: state.newQueue.trigger
        }
    },
    dispatch => {
        return {
            getAllTaskGroups: (type, keyword) => actions.getAllTaskGroups(type, keyword, dispatch)
        }
    }
)(ContentWrapper);

const TaskList = connect(
    function (state) {
        return state.taskList
    },
    function (dispatch) {
        return {
            getData: (params) => {
                actions.taskListSetPageIndex(dispatch, params);
                actions.taskListRenderData(dispatch, params);
                actions.taskListRequest(dispatch, params);
            }
        }
    }
)(table);

class Content extends Component {

    render() {
        const { location, avatar, userName, email, isAddQueue, queueList, 
                triggerAddQueue, triggerAddTask, handleCancel,isAddTask, getAllTaskGroups, 
                taskGroupOperation,handleOk, changeQueueName ,isVisible,triggerShowModal,
                onCascaderChange
            }  = this.props;
        const pathname = location.pathname;
        const tab = _.find(tabs, (i) => i.path == pathname) || _.find(queueList, (i) => i.wf_taskgroup_id == pathname.substring(1)) || {};
        return (
            <div className="allFont">
                <ContentHeader title="商品列表" className="goodsHead" icon="task" sprite="standard-sprite" iconClassName="slds-icon-standard-task" subtitle="">
                    <Button className="addToActivety" type="primary" onClick={triggerShowModal}>加入活动</Button>
                    <Modal
                        title="活动列表"
                        visible={isVisible}
                        onOk={handleOk}
                        onCancel={handleCancel}
                    >
                    <Search
                        placeholder="输入活动名称"
                        onSearch={value => console.log(value)}
                    />
                    <p>Some contents...</p>
                    <p> 11111</p>
                    <p>所有活动：</p>
                    </Modal>
                    <Button type="primary" icon="plus" onClick={triggerAddTask}> 添加商品</Button>
                </ContentHeader>
             <div className="content">
                <div className="row">
                  <div className="col-md-12">
                        <div className="box box-solid profile-content">
                            {this.props.children}
                        </div>
                    </div>
                </div> 
             </div> 
            <_NewTask triggerAddTask={triggerAddTask}/>
        </div>
        )
    }
}

const _Content = connect(
    state => {
        return {
            isAddQueue: state.newQueue.isAddQueue,
            queueList: state.queueList,
            isAddTask: state.newTask.isAddTask,
            isVisible: state.visible
        }
    },
    dispatch => {
        return {
            triggerAddQueue: (queue) => actions.triggerAddQueue(dispatch, queue),
            triggerAddTask: () => {
                dispatch({
                    type: 'trigger-add-goods'
                });
            },
            triggerShowModal:()=> {
                dispatch({
                    type: 'trigger-showModal'
                });
            },
            onCascaderChange:(value)=>{
                console.log(value)
            },
            handleOk:()=> {
                dispatch({
                    type: 'trigger-hideModal'
                });
            },
            handleCancel:()=> {
                dispatch({
                    type: 'trigger-cancelModal'
                });
            },
        }
    }
)(Content);

export default _ContentWrapper;